<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@include file="/context/mytags.jsp"%>
<t:base type="jquery,easyui,tools,DatePicker"></t:base>
<link rel="stylesheet" href="plug-in/ztree/css/zTreeStyle.css" type="text/css">
<script type="text/javascript" src="plug-in/ztree/js/jquery.ztree.core-3.5.min.js"></script>
<script type="text/javascript" src="plug-in/ztree/js/jquery.ztree.excheck-3.5.min.js"></script>
<script type="text/javascript" src="plug-in/hac/NVRnew.js"></script>
<style>
	.plugin{
		width: 100%;
    	background-color: black;
    	height: 100%;
    	color:white;
	}
	
	.noPluginTip{
		text-align: center;
		display: block;
	}
	
	a.noPluginTip {
		line-height: 500px;
    	text-align: center;
    	font-size: 16px;
    	color:white;
	}
	a.noPluginTip:hover{
		text-decoration:underline;
		 
	}
	 
</style>
<SCRIPT type="text/javascript">
 
	var setting = {
		async: {
			enable: true,
			url:"hacVideoController.do?tree"
		},
		data: {
			key: {
				name: "text"
			}
		},
		callback: {
			onAsyncSuccess: zTreeOnAsyncSuccess,
			onClick: zTreeOnClick
		}
	};
	
	var treeObj;
	var currentNode = null;
	$(document).ready(function(){
		$.fn.zTree.init($("#ztree"), setting);
		treeObj = $.fn.zTree.getZTreeObj("ztree");
	});
	
	function zTreeOnAsyncSuccess(event, treeId, treeNode, msg) {
		treeObj.expandAll(true);
		currentNode = treeObj.getNodesByFilter(function (node) { return node.level == 0 }, true).id;
	}
	
	function zTreeOnClick(event, treeId, treeNode) {
		 if(treeNode.parentTId != null){
			currentNode = treeNode.id; 
			$('#IP').val(treeNode.attributes.ip);
			$('#MM').val(treeNode.attributes.password);
			$('#DLM').val(treeNode.attributes.loginName);
			$('#DZ').val(treeNode.attributes.addr);
			$('#DKH').val(treeNode.attributes.port);
			$('#Channelid').val(treeNode.attributes.channelid); 

			ChangeYou();
		 } 
	};
	
	function getCurrentNode(){
		return currentNode;
	}
	
	function isIE() {
          if (!!window.ActiveXObject || "ActiveXObject" in window)
              return true;
          else
              return false;
    }
      
	$(document).ready(function(){
		if (!isIE()) { 
	          document.getElementById("divPlugin").innerHTML = "<embed id='HIKOBJECT' type='application/mozilla-hikvideo-plugin'  width='100%' height='100%'> </embed>";
	    }   
		
		//给时间控件加上样式
 	    $("#starttime").attr("class","Wdate").click(function(){WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss'});});
 		$("#endtime").attr("class","Wdate").click(function(){WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss'});});  
 	 
 		$('#starttime').val('${start}');
 		$('#endtime').val('${end}');
	});
	 
</SCRIPT>

 <input id="serverip" type="hidden" value="" />
    <input id="name" type="hidden" value="" />
    <input id="pwd" type="hidden" value="" />
    <input id="IP" type="hidden" value="" />
    <input id="DKH" type="hidden" value="" />
    <input id="DLM" type="hidden" value="" />
    <input id="MM" type="hidden" value="" />
    <input id="DZ" type="hidden" value="" />
    <input id="Channelid" type="hidden" value="" />

<div class="easyui-layout" fit="true">
	<div region="west"    split="false" collapsed="false" style="width:850px">
		 <div id="divPlugin" class="plugin">
		 	<object classid="CLSID:CAFCF48D-8E34-4490-8154-026191D73924" standby="Waiting..."
                    id="HIKOBJECT" name="HIKOBJECT">  
             </object>
		 </div>
	</div>
	<div region="center" style="padding:0px;border:0px;" >
	   <div  class="easyui-panel" title="搜索" style="height:250px;margin:0;"> 
	   	<table style='width:100%;'>
					<tr>
						<td class="tt">开始时间</td>
						<td>
							<input id="starttime" type="text" class="txt" readonly="readonly" /> 
						</td>
					</tr>
					<tr>
						<td class="tt">结束时间</td>
						<td>
							<input id="endtime" type="text" class="txt" readonly="readonly" /> 
						</td>
					</tr>
					<tr>
						<td colspan="2" style='text-align:center;padding:5px;'>
							<a  class="myBtn" value="搜索" onclick="doSearch()" >搜索</a>
						</td>
					</tr>
					<tr>
						<td colspan="2">
							 <div id="recordlist" style="margin-top: 2px;height:100px;overflow:auto;border:1px solid #ddd;">
					            <ul style="list-style: none" id="recordlistul">
					            </ul>
        					</div>
						</td>
					</tr> 
				</table>	
			</div>
				
			<div  class="easyui-panel" title="选择摄像头" style="height:300px;">
					   	<ul id="ztree" class="ztree"></ul> 
			</div>
	</div>
</div>

<style>
	.panel-header,.panel-body{
		width:100%  !important;
		border-bottom:none;
	}
</style>
 